<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <!-- 告诉IE选用最新的版本 -->
    <meta http-equiv="X-UA-Compatible" content="IE-edge,chrome=1">
    <meta name="viewport" content="width=device">
    <link rel="stylesheet" type="text/css" href="css/normalize.css">
    <link rel="stylesheet" type="text/css" href="css/enjoy.css">
    <title>获奖作品</title>
</head>

<body>
    <div class="container">
        <div class="st-container">
            <!-- 导航开始 -->
            <input type="radio" name="radio-set" checked="checked" id="st-control-1">
            <a href="#st-panel-1">风光摄影</a>
            <input type="radio" name="radio-set" id="st-control-2">
            <a href="#st-panel-2">人文纪实</a>
            <input type="radio" name="radio-set" id="st-control-3">
            <a href="#st-panel-3">商业摄影</a>
            <input type="radio" name="radio-set" id="st-control-4">
            <a href="#st-panel-4">艺术摄影</a>
            <input type="radio" name="radio-set" id="st-control-5">
            <a href="#st-panel-5">微距摄影</a>
            <!-- 导航结束 -->
            <!-- 每个标签对应的内容 -->
            <div class="st-scroll">
            	<section class="st-panel" id="st-panel-1">
            	<!-- 图标 -->
            		<div class="st-desc" data-icon="H"></div>
            		<h2>风光摄影</h2>
            		<p>介绍</p>
                    <div class="left-part"></div>
                    <div class="right-part"></div>
            	</section>
            	<section class="st-panel st-color" id="st-panel-2">
            	<!-- 图标 -->
            		<div class="st-desc" data-icon="2"></div>
            		<h2>人文纪实</h2>
            		<p>介绍</p>
            	</section>
            	<section class="st-panel" id="st-panel-3">
            	<!-- 图标 -->
            		<div class="st-desc" data-icon="B"></div>
            		<h2>商业摄影</h2>
            		<p>介绍</p>
            	</section>
            	<section class="st-panel st-color" id="st-panel-4">
            	<!-- 图标 -->
            		<div class="st-desc" data-icon="h"></div>
            		<h2>艺术摄影</h2>
            		<p>介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
            	</section>
            	<section class="st-panel" id="st-panel-5">
            	<!-- 图标 -->
            		<div class="st-desc" data-icon="C"></div>
            		<h2>微距摄影</h2>
            		<p>介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍介绍</p>
            	</section>
            </div>
        </div>
        <!--st-container结束-->
    </div>
    <!--container结束-->
</body>

</html>
